/**
 * Created by DuHuiling on 2017/4/25.
 */
var Agreement = React.createClass({
    getDefaultProps:function () {
        return{
            url:PageDM.URL.value
        }
    },
    getInitialState:function () {
        return{
            url:this.props.url
        }
    },
    render:function () {
        return <a href={this.state.url.agreement.link} className="agreement" target="_blank"><i className="iconfont icon-protocol11"></i>《{this.state.url.agreement.name}》</a>
    }
});

var InvestDetail = React.createClass({
    getInitialState:function(){
        return{
            ProDetail:this.props.ProDetail
        }
    },
    //导出PDF文件
    exportPDF:function(){
        //console.log(this.refs.getRealDom);
        this.props.exportPDF.onClick(this.refs.getRealDom.outerHTML);
    },
    getRefs:function (ref) {
        return this.refs[ref];
    },
    render:function(){
        var _this = this, _state = _this.state,
            ProDetail = _state.ProDetail.ProjectDetail,
            FinancingDetail = _state.ProDetail.FinancingDetail;
        //剩余时间
        var RepayBegin = UFormatter.formatTime(ProDetail.RepayBegin,"yyyy/mm/dd");
        var remain = Math.ceil((new Date(RepayBegin) - new Date()) / 1000 / 60 / 60 / 24);
        if(remain < 0)
            remain = 0;
        //数字格式化
        var TotalRepayment = Number(FinancingDetail.TotalRepayment),_moreOverTotal = false,
            IAmount = Number(ProDetail.IAmount),_moreOverIAmount = false,
            FinancingCost = Number(FinancingDetail.FinancingCost), _moreOverFC = false;
        // if(TotalRepayment < 10000){
            TotalRepayment = UFormatter.formatMoney(TotalRepayment,2);
        // }else{
        //     TotalRepayment = UFormatter.formatMoney(TotalRepayment / 10000,2);
        //     _moreOverTotal = true;
        // }
        // if(IAmount < 10000){
            IAmount = UFormatter.formatMoney(IAmount,2);
        // }else{
        //     IAmount = UFormatter.formatMoney(IAmount / 10000,2);
        //     _moreOverIAmount = true;
        // }
        // if(FinancingCost < 10000){
            FinancingCost = UFormatter.formatMoney(FinancingCost,2);
        // }else{
        //     FinancingCost = UFormatter.formatMoney(FinancingCost / 10000,2);
        //     _moreOverFC = true;
        // }
        return(
            <div className="invest-detail">
                <div className="title-account"><span>融资详情</span>
                    <div className="other">
                        <a href="javascript:void (0)" onClick={this.exportPDF.bind(this)}><i className="iconfont icon-export"></i><p>导出PDF文件</p></a>
                        <a href="javascript:void (0)" onClick={this.props.printBtn.onClick}><i className="iconfont icon-print"></i><p>打印</p></a>
                        <a href={PageDM.URL.value.goBack}><i className="iconfont icon-back"></i><p>返回</p></a>
                    </div>
                </div>
                <div ref="getRealDom">
                    <h1>
                        {ProDetail.ProjectName}
                        <span className={"tag "+((ProDetail.F_Status == 1 || ProDetail.F_Status == 2 || ProDetail.F_Status == 3) ? "tag-red" : (ProDetail.F_Status == 6 ? "tag-grey" : "tag-yellow" ))}>
                            {
                                ProDetail.F_Status == 1 ? "还款中" :
                                ProDetail.F_Status == 2 ? "还款完成" :
                                ProDetail.F_Status == 3 ? "融资完成" :
                                ProDetail.F_Status == 4 ? "投标中" :
                                ProDetail.F_Status == 5 ? "预热中" :
                                ProDetail.F_Status == 6 ? "项目流标" : ""
                            }
                        </span>
                        {ProDetail.F_Status == 1 ?
                            <span className="countdown-data"><i className="iconfont icon-clock"></i>距离还款日还有：<b className="fc-main">{remain}天</b></span> : ""
                        }
                    </h1>
                    <div className="money">
                        <ul className="clearfix">
                            <li className="col-1">
                                <p className="fc-main"><b className="fs42">{TotalRepayment}</b>{_moreOverTotal?"万元":"元"}</p>
                                <p className="fc-light">到期应还资金总额</p>
                            </li>
                            <li className="col-2">
                                <p>还款日期<b>{ProDetail.RepayBegin}</b></p>
                                <p>借款人<b>{this.state.ProDetail.CallbackAccount.AccountName}</b></p>
                            </li>
                        </ul>
                    </div>
                    <div className="info">
                        <ul className="clearfix">
                            <li><p><b>{IAmount}</b>{_moreOverIAmount?"万元":"元"}</p>
                                <p className="fc-light">融资金额</p></li>
                            <li><p className="fc-main"><b>{FinancingCost}</b>{_moreOverFC?"万元":"元"}</p>
                                <p className="fc-light">融资成本</p></li>
                            <li><p className="fc-main"><b>{ProDetail.FinanceRate}</b>%</p>
                                <p className="fc-light">融资利率</p></li>
                        </ul>
                    </div>
                    <div className="pro-data">
                        <ul className="clearfix">
                            <li>融资期限：{ProDetail.Duration+"天"}</li>
                            <li>起息日：{ProDetail.ValueBegin}</li>
                            <li>到期日：{ProDetail.RepayBegin}</li>
                        </ul>
                    </div>
                    <div className="bank-back clearfix">
                        <label className="f-left">回款账户：</label>
                        <div className="input f-left">
                            <span className={"bank-logo "+this.state.ProDetail.CallbackAccount.BankLogo}></span>
                            <span>{this.state.ProDetail.CallbackAccount.AccountNo}</span>
                        </div>
                        {(ProDetail.F_Status == 1 || ProDetail.F_Status == 2) ?
                            <Agreement ref="agreement"/> : ''
                        }
                    </div>
                </div>
                <span className="angle angle-right-bottom"></span>
            </div>
        )
    }
});
module.exports = InvestDetail;